{% extends 'base.html' %}

{% load static %}

{% block head %}
    <title>Bulk Create Candidates</title>
{% endblock %}

{% block content %}
<link rel="stylesheet" type="text/css" href="{% static 'admin/css/forms.css' %}">
<link rel="stylesheet" type="text/css" href="{% static 'admin/css/widgets.css' %}">
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}" >
<script type="text/javascript" src="{% static 'js/jquery.js' %}"></script>

<h1>Bulk Create Candidates and Interviews</h1>

 <form role="form" method="post" enctype="multipart/form-data"  style="margin-bottom: 20px;">

    {% csrf_token %}
    <table class="table">
        {{ form}}
        {{ form.errors }}
    </table>

    <h2>Add Rounds</h2>

    {{round_form.management_form}}
    <hr>

        <div id="form_set">

        {% for form in round_form %}
            {{ form.id }} <!--This is just for handling an error during save after editing -->
            {{ form.media }}
            <table class="table">
                {{ form.as_table }}
            </table>
        {% endfor %}
        </div>

        <input type="button" value="+ Round" id="add_more" class="btn btn-info btn-lg"></input>

        <div id="empty_form" style="display:none">
            <table class='table'>
                <h1> New Round:</h1>
                {{ round_form.empty_form.as_table }}
            </table>
        </div>

        <input class="btn btn-success btn-lg mt-4" type="submit" name="Upload" value="Create">
        {% if form.instance.id %}
            <a class="btn btn-lg btn-danger" href="{% url 'Evaluator:interview_details' form.instance.pk %}">Cancel</a>
        {% else %}
            <a class="btn btn-lg btn-danger" href="{% url 'Evaluator:profile' %}">Cancel</a>
        {% endif %}
        </div>
 </form>


<script type="text/javascript" src="/admin/jsi18n/"></script>
<script type="text/javascript" src="{% static 'admin/js/core.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/admin/RelatedObjectLookups.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/vendor/jquery/jquery.min.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/jquery.init.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/actions.min.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/calendar.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/admin/DateTimeShortcuts.js' %}"></script>

{# The below script is to create multi copies of Round form using + button #}
<script type="text/javascript">
    $('#add_more').click(function()
    {
     var form_idx = $('#id_form-TOTAL_FORMS').val();
        $('#form_set').append($('#empty_form').html().replace(/__prefix__/g, form_idx));
        $('#id_form-TOTAL_FORMS').val(parseInt(form_idx) + 1);
    });

</script>

{% endblock %}
